<div class="log">
  <div class="log__loader" *ngIf="loading">
    <hs-loader class="log__loader-icon"></hs-loader>
  </div>
  <div class="log__body" *ngIf="haveSomeData; else noDataAvailable">
    <ul class="log__ids">
      <li
        *ngFor="let check of checks; let i = index"
        class="log__ids-item"
        [ngClass]="{
          'log__ids-item--selected': i === selectedIndex,
          'log__ids-item--failed': isFailed(check)
        }"
        (click)="selectItem(i)"
      >
        {{ check._id | checkIdToTime | hsFormatDate }}
      </li>
    </ul>
    <div class="log__detailed">
      <hs-log-detail
        *ngIf="selectedCheck"
        [check]="selectedCheck"
        [modelVersion]="modelVersion"
      ></hs-log-detail>
    </div>
  </div>
</div>
<ng-template #noDataAvailable>
  <div class="log__message">
    No data available
  </div>
</ng-template>
